<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
	<link type="text/css" rel="stylesheet" href="/stylesheet/main.css">
	
	<script type="text/javascript" src="stylesheet/jquery-1.7.2.min.js"></script>
	<script type="text/javascript" src="stylesheet/jquery-ui-1.8.21.custom.min.js"></script>
  <script type="text/javascript" src="stylesheet/add.js"></script>
  <script type="text/javascript" src="stylesheet/autocom.js"></script>
	<script type="text/javascript" src="stylesheet/blockUI.js"></script>
	<script type="text/javascript" src="stylesheet/edit.js"></script>
  <script type="text/javascript" src="stylesheet/jeditable.js"></script>
  <script type="text/javascript" src="stylesheet/jeditable.charcounter.js"></script>
  <script type="text/javascript" src="stylesheet/login.js"></script>
  <script type="text/javascript" src="stylesheet/jquery.infinitescroll.min.js"></script>
  <script type="text/javascript" src="stylesheet/jquery.masonry.min.js"></script>
</head>


<body>
<div id="home">
		<div id="banner">
			Banner LOGO
		</div>
	<div id="search">
		<form action="/search?" id="search_form" method="GET">
			<div>
				<input id="search_input" type="text" name="term" >
			</div>
		</form>
	</div>

	<div id="result">
		<p class="show_result_error">找不到東西...</p>
		<p class="show_result_ok"></p>
	</div>
	
	<div class="navigation"></div>

	<div id="admin">
	{% if login_status %}
	   <span class="toggle"><a id="add_link" href="#">加新字</a></span> &nbsp; &nbsp;
	   <div id="add_main">
 	     <form action="/add" id="add_form" method="POST" >
    	 	<table>
      		  <tbody>
      		  	
        	    <tr>
          		  <th><font color="#FF00CC">新字:</font></th>
          		  <td><input id="word", name="word" type="text"></font></td>
                </tr>
                <tr>
                  <th><font color="#FF00CC">解釋:</font></th>
                  <td><textarea id="define", name="define" rows="10" cols="50" type="text"></textarea></td>
                </tr>       
                <tr>
                  <th><font color="#FF00CC">造句:</font></th>
                  <td><textarea id="example", name="example" rows="10" cols="50" size="60" type="text"></textarea></td>
                </tr>     
                <tr>
                  <th><font color="#FF00CC">標籤:</font></th>
                  <td><input id="tag", name="tag" size="30" type="text"></td>
                </tr>
                <tr>
                	<select id="word_source"> 
										<option value="taiwan" selected> 台灣
										<option value="china"> 中國
										<option value="hongkong"> 香港
										<option value="singapore"> 新加坡
										<option value="us"> 美國
										<option value="eu"> 歐洲
										<option value="others"> 其他											
									</select>
                </tr>	
                
              </tbody>
            </table>
     	  <div id="submit">
      	   <input name="submit" value="送出新字" class="add_word" type="submit">
    	  </div>
    		<!-- Submit result shows up here. -->
    		<div id="submit_result"></div>
  		 </form> <!-- form action="/add" end-->
	   </div> <!-- add_main -->
	  
	  <a class="moveme" id="edit_toggle" href="#edit" ref="" >修改</a> &nbsp; &nbsp;
	  <a href="{{ url_link }}"> {{ url_text }} </a>
	
	{% else %}
    <!-- Show login section -->
    <div class="login_auth"></div>
    	 
  {% endif %}
  </div> <!-- admin end-->
	<br><br>
	<div id="top10">
		<a id="top10_link" href="/top10">Top10</a> &nbsp; &nbsp;
		<div class="total_words">我們目前總共有 <span class="all_words">{{ total_words }}</span> 個字</div> &nbsp; &nbsp;
	</div>
</div> <!-- home -->


<!-- User edit area -->

<div id="edit">
	
	<div id="user_info">
		<div id="profile_icon"> </div>
		<div id="user_detail"> </div>
	</div> <!-- user_info end -->


	{% if user_editable_word %}	
		<div id="user_words_edit">
      <a id="edit_finish" href="#home">返回首頁</a>
      
      <!-- User's added words edit area start from here -->
			<ul class="thumb">
      {% for list_query in user_editable_word %}
			 <li>
	       <div class="edit_area" id="{{ list_query.key }}">
		        <p> {{ list_query.Word }} </p>
		        <div class="edit_default" type="text" id="d{{ list_query.key }}">{{ list_query.Define }}</div>
		        <div class="edit_default" type="text" id="e{{ list_query.key }}">{{ list_query.Example }}</div>
		        <div class="edit_default" type="text" id="t{{ list_query.key }}">{{ list_query.Tag }}</div> 	
	       </div>  <!-- edit_area -->
       </li>
			{% endfor %}
		  </ul>  
		</div> <!-- user_words_edit end -->
  {% endif %}
  
  <!-- User's favorite words(aka:bookmark) area start from here -->
  <div id="user_favorite_edit">
  </div> <!-- user_favorite_edit end -->
</div>  <!-- edit end -->


</body>
</html>